<template>
  <!-- 页面-单据序列-输入参数 -->
  <div style="height:330px" class="RoleAssignApp-page">
    <InnerPageTable :config="pageTableConfig"></InnerPageTable>
  </div>
</template>
<script>
import locales from "./locales.js";
import { mapState, mapActions } from "vuex";
import ReceiptSequenceRule from "./ReceiptSequenceRule";
export default {
  mixins: [locales],
  props: {
    parameter: {
      type: Array,
      default: () => {
        return [];
      }
    },
    objReceiptSeqCode: {
      type: Object,
      default: () => {
        return {};
      }
    }
  },
  data() {
    let _obj = this.objReceiptSeqCode;
    return {
      pageTableConfig: {
        columnsFn: this.columns,
        isPage: false,
        resource: []
      },
      actions: [
        {
          text: this.$t("common.determine"),
          theme: "primary",
          handle: () => {
            this.determine();
          }
        },
        {
          text: this.$t("common.close"),
          theme: "primary",
          handle: () => {
            this.$emit("Close");
          }
        }
      ],
      sequence: {
        paramObj: {},
        receiptSeqCode: _obj.receiptSeqCode,
        isAvailable:_obj.isAvailable
      }
    };
  },
  computed: {},
  created: function() {
    this.$emit("SetTitle", this.$t("module.receiptSequence.inputParameter"));
    this.$emit("SetPageWidth", 706);
    this.$emit("SetPageActions", this.actions);
  },
  mounted() {
    // let arr = Object.assign([],this.parameter);
    let arr = JSON.parse(JSON.stringify(this.parameter));
    let newArr = [];
    arr.forEach(item => {
      if (item.ruleSegmentField === "参数") {
        return newArr.push(item);
      }
    });
    this.pageTableConfig.resource = newArr;
  },
  methods: {
    columns() {
      return [
        {
          title: this.$t("module.receiptSequence.parameterCode"),
          key: "receiptSeqCode",
          render: (h, params) => {
            return h(
              "div",
              {
                attrs: {}
              },
              params.row.paramCode
            );
          }
        },
        {
          title: this.$t("module.receiptSequence.parameterName"),
          key: "id",
          render: (h, params) => {
            return h(
              "div",
              {
                attrs: {}
              },
              params.row.paramName
            );
          }
        },
        {
          title: this.$t("module.receiptSequence.parameterValue"),
          key: "paramDefaultValue",
          render: (h, params) => {
            return h("div", [
              h("input", {
                attrs: {
                  type: "text",
                  value: params.row.paramDefaultValue
                },
                on: {
                  change: event => {
                    this.pageTableConfig.resource[params.index].paramDefaultValue = event.target.value;
                  }
                }
              })
            ]);
          }
        }
      ];
    },
    // 确定
    determine() {
      this.pageTableConfig.resource.forEach(item => {
        let key = item.paramCode;
        let value = item.paramDefaultValue;
        let obj = this.sequence.paramObj;
        obj[key] = value;
      });
      window.$http
        .post(`${window.RPConfig.setting}/sys/receiptSeq/apply`, this.sequence)
        .then(response => {
          this.actions[0].loading = false;
          this.$message.success({
            content: this.$t("module.receiptSequence.obtainSuccess"),
            duration: 3
          });
          this.$emit("Close", response.data);
        })
        .catch(err => {
          this.actions[0].loading = false;
        });
    }
  }
};
</script>
<style lang="less">
// ok统一注释的样式
// .RoleAssignApp-page {
//   .run-search-bar {
//     div:first-child {
//       margin-right: 0px!important;
//     }
//   }
// }
</style>